<template>
	<view class="topImg">
		<img src="http://rchqfbdix.hn-bkt.clouddn.com/%E5%8D%83%E5%BA%93%E7%BD%91_25D%E7%A7%91%E6%8A%80%E7%A7%AF%E5%88%86%E5%95%86%E5%9F%8E_%E5%85%83%E7%B4%A0%E7%BC%96%E5%8F%B712892514.png" alt="">
	</view>
	<view class="outer">
		
		<button @click="get" type="primary" class="top">微信授权登录</button>
		<button @click="phoneLogin">手机号码登录</button>
		<uni-popup ref="popup" type="center">
			<view class="tanchu">
				<text style="font-size: 36rpx;">欢迎登录</text>
				<view style="padding-bottom: 30rpx;border-bottom: 1px solid #999999;">
					<text class="iconfont icon-shouji"></text>
					<input class="phoneNum" v-model="phone" focus placeholder="请输入手机号" />
				</view>
				<view style="padding-bottom: 30rpx;border-bottom: 1px solid #999999;">
					<text class="iconfont icon-yuechi_o"></text>
					<input class="pwdNum" v-model="LogPwd" password type="text" placeholder="请输入密码" />
				</view>
				<button type="primary" class="login" style="margin-top: 50rpx;" @click="Plogin()">登录</button>
			</view>
		</uni-popup>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				phone:'',
				LogPwd:''
			
			}
		},
		methods: {
			phoneLogin(){
			        // 通过组件定义的ref调用uni-popup方法 ,如果传入参数 ，type 属性将失效 ，仅支持 ['top','left','bottom','right','center']
			        this.$refs.popup.open('bottom')
			      },
			get(){
				wx.getUserProfile({
				      desc: '用于完善会员资料', 
				      success: (res) => {
				        console.log(res);
						uni.setStorage({
							key: 'userInfo',
							data: res.userInfo.nickName,
							success: function () {
							}
						});
						uni.setStorage({
							key: 'userImg',
							data: res.userInfo.avatarUrl,
							success: function () {
							}
						});
						//发起请求
						new Promise((resolve,reject)=>{
							uni.request({
							    url: 'http://localhost:3001/addUserName', //仅为示例，并非真实接口地址。
								method:'POST',
								data:{
									userName:res.userInfo.nickName,
									imgSrc:res.userInfo.avatarUrl,
								},
							    success: (res) => {
							        console.log(res);
									if(res!=null){
										resolve('操作成功')
									}
							    }
							});
						}).then((ad)=>{
							if(ad=='操作成功'){
								uni.request({
								    url: 'http://localhost:3001/seachPwd', //仅为示例，并非真实接口地址。
									method:'POST',
									data:{
										userName:res.userInfo.nickName
									},
								    success: (res) => {
								        console.log(res.data.data[0].payPwd);
										if (res.data.data[0].payPwd==null) {
											uni.showModal({
												title: '提示',
												content: '请完善个人信息',
												success: function (res) {
													if (res.confirm) {
														uni.switchTab({
														  url: '/pages/uesr/uesr',
														})
													} else if (res.cancel) {
														wx.switchTab({
														  url: '/pages/index/index',
														})
													}
												}
											})
										}else{
											wx.switchTab({
											  url: '/pages/index/index',
											})
										}
								    }
								});
							}
						})
						
					
				      }
				    });
					
					
			},
			Plogin(){
				let phone=this.phone
				let LogPwd=this.LogPwd
				console.log(phone,LogPwd)
				uni.request({
				    url:'http://localhost:3001/phoneLogin', //仅为示例，并非真实接口地址。
					method:'POST',
					data:{
						phone:phone,
						LogPwd:LogPwd
					},
				    success: (res) => {
						if(res.data.data.length==0){
							uni.showModal({
								title: '提示',
								content: '账号密码错误请使用微信登陆后完善个人信息',
								success: function (res) {
									if (res.confirm) {
										uni.switchTab({
										  url: '/pages/uesr/uesr',
										})
									} else if (res.cancel) {
										wx.switchTab({
										  url: '/pages/index/index',
										})
									}
								}
							});
							
						}else{
							uni.setStorage({
								key: 'userInfo',
								data: res.data.data[0].userName,
								success: function () {
								}
							});
							uni.setStorage({
								key: 'userImg',
								data: res.data.data[0].imgSrc,
								success: function () {
								}
							});
							wx.switchTab({
							  url: '/pages/index/index',
							})
						}
						
				    }
				});
			}
			
		}
	
	}
</script>

<style>
	@import url("~@/static/fonts/iconfont.css");
	
	.tanchu{
		border-radius: 20rpx;
		height: 36vh;
		background-color: #fff;
		box-sizing: border-box;
		padding-top: 10rpx;
		padding-left: 20rpx;
		padding-right: 20rpx;
	}
	.tabchu .login{
		margin-top: 20rpx;
	}
	.outer>button{
	width: 500rpx;
	}
	.tanchu input{
		width:600rpx ;
		padding-top: 25rpx;
	}
	.top{
		margin-top: 16vh;
		margin-bottom: 1vh;
	}
	uni-popup{
		width: 100rpx;
		height: 100rpx;
	}
	.tanchu>view{
		display: flex;
		vertical-align: baseline;
	}
	.tanchu>view text{
		box-sizing: border-box;
		padding-top: 30rpx;
	}
	.topImg{
		margin-top: 16vh;
		text-align: center;
		
	}
</style>
